<template>
    <div class="page_applyLendMoney">
        <van-nav-bar :title="title" left-arrow @click-left="$router.back()" />

        <van-form @submit="createAdvanceBill">
            <van-field autocomplete="off" v-model="apply_money"
                       type="digit" name="apply_money" :disabled='search_type' label="申请借支金额"
                       :placeholder='`请输入借支金额(必填)`'
               :rules="[
                 { required: true, message: '未填写' },
                 /*{
                   validator: ((value) => {return valueLimit(value, $route.query.canLendAmount)}),
                   message: `申请的借支金额不能大于${$route.query.canLendAmount}元`,
                 },*/
               ]"
               required
            />
            <van-field autocomplete="off" v-if="search_type && createTime" v-model="createTime" name="createTime" :disabled='search_type' label="申请时间" />
            <van-field autocomplete="off" v-model="depart_name" name="depart_name" label="部门" :disabled='search_type'
                placeholder="请输入你当前所在的部门(必填)" :rules="[{ required: true, message: '未填写' }]" required />
            <van-field autocomplete="off" v-model="staff_name" name="staff_name" label="您的姓名" :disabled='search_type'
                placeholder="请输入您的姓名(必填)" :rules="[{ required: true, message: '未填写' }]" required />
            <van-field autocomplete="off" v-model="staff_id" name="staff_id" label="您的工号" :disabled='search_type' placeholder="请输入您的工号(必填)"
                :rules="[{ required: true, message: '未填写' }]" required />
            <van-field autocomplete="off" v-model="idCard" name="idCard" label="身份证号" :disabled='search_type' placeholder="请输入身份证号码(必填)"
                :rules="[
                  { required: true, message: '未填写' },
                  { pattern: idPattern, message: '请输入正确身份证号码' }]" required />
            <van-field autocomplete="off" v-model="telephone" name="telephone" label="手机号" type="number" :disabled='search_type'
                placeholder="请输入手机号码(必填)" :rules="[{ required: true, message: '未填写' }]" required />

            <DebounceSubmitBtn
              v-show="!search_type"
              :isSubmitBtnDisabled="isSubmitBtnDisabled"
              :textName="'提交申请'"
            />
        </van-form>
        <!-- @click="createAdvanceBill" -->
    </div>
</template>

<script>
import {idCardReg} from '../../constants/comUtils'
import {Toast} from 'vant';
import {mixin_btnStatus} from "../../mixin/mixin_btn";
import DebounceSubmitBtn from "../../components/DebounceSubmitBtn";

export default {
  name: 'applyLendMoney',
  mixins: [mixin_btnStatus],
  components: {
    DebounceSubmitBtn,
  },
  data() {
    return {
      idPattern: idCardReg,
      apply_money: '', // 借支金额
      depart_name: '', // 部门
      staff_name: '', // 姓名
      staff_id: '', // 工号
      telephone: '', // 手机号
      idCard: '', // 身份证号码
      createTime: '', // 申请时间
      search_type: false,
      title: '提交借支申请'
    }
  },
  created() {
    if (this.$route.query.search_type) {
      this.title = '查看借支申请'

      // 获取用户借支信息
      this.getUserApplyAdvance(this.$route.query.id, this.$route.query.job_user_id)
    }
  },
  mounted() {
    if (this.$route.query.search_type) this.search_type = true
  },
  methods: {

    // 校验输入内容的字长
    valueLimit(val, limitValue) {
      console.log(val*1, limitValue*1)
      return val*1 < limitValue*1;
    },


    // 创建借支单
    createAdvanceBill() {
      this._updateSubmitBtnStatus();

      let params = {
        Money: this.apply_money,
        JobId: this.staff_id,
        Name: this.staff_name,
        TEL: this.telephone,
        IdentityID: this.idCard,
        Sector: this.depart_name,
        PositionId: this.$route.query.id //从 query 中传入的 job_id  By jiayifei 2021-01-23
      }

      this.$api.myCompany.reqCreateAdvanceBill(params).then(res => {
        if (res.code === 200) {
          if (res.data.result == '1') {
            Toast.success('申请成功')
            setTimeout(() => {
              this.$router.back()
            }, 500)
          } else {
            Toast.success('申请失败')
          }
        } else {
          Toast('操作失败请重试！')
        }
      })
    },

    // 获取用户借支信息
    getUserApplyAdvance(jobId, jobUserId) {
      let params = {
        UserId: jobUserId,
        PositionId: jobId
      }

      this.$api.myCompany.getUserApplyAdvance(params).then(res => {
        if (res.code === 200) {
          if (res.data.length > 0) {
            let item = res.data[0]
            this.apply_money = item.money
            this.createTime = item.createTime
            this.depart_name = item.sector
            this.staff_name = item.name
            this.staff_id = item.jobId
            this.telephone = item.tel
            this.idCard = item.identityID
          } else {
            Toast('无待处理的借支申请!')
          }
        } else {
          Toast('系统异常!')
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.page_applyLendMoney {
  width: 100%;
}
</style>
